<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>14.6 综合实例</title>
<link href="global.css" rel="stylesheet" />
</head>

<body>
<div id="wrapper">
  <header>
    <h1>AMBITIOUS</h1>
    <nav>
      <ul>
        <li><a href="#">contacts</a></li>
        <li><a href="#">portfolio</a></li>
        <li><a href="#">news</a></li>
        <li><a href="#">pages</a></li>
        <li><a href="#">features</a></li>
        <li><a href="#" class="home">home</a></li>
      </ul>
    </nav>
  </header>
  <div class="container">
    <div class="banner"> 
	<img src="ambitios_pic1.png" alt="pic01" width="553" height="324" class="leftimg">
      <h1>women prefer</h1>
      <h1>pastel colored flowers</h1>
      <p>Flowers were used to signal meanings in the time when social meetings between men and women was difficult. Lilies make people think of life. Red roses make people think of love, beauty, and passion.</p>
      <p> Everyone love flowers, but some just don't know that they do.</p>
      <a href="#"><img src="ambitios_footer_button.png" alt="button" width="199" height="62" class="button"></a> 
     </div>



    <div class="content">
      <div class="box1">
        <h2>wide range of<br> header sliders</h2>
        <div class="box">
          <p>We already have 3 absolutely different sliders, such as:</p>
          <ul>
            <li>Simple but stylish JCycle</li>
            <li>Famous 3d slider</li>
            <li>Carousel slider</li>
          </ul>
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus condimentum, massa eu</p>
        </div>
      </div>
      <div class="box2">
        <h2>variety of<br> portfolio<br> layouts</h2>
        <div class="box">
          <p> Currently we have 3 portolfio layouts.</p>
          <p> Simple image gallery, that is perfect for photos.</p>
          <p> Big image preview with description, perfect for designers to show their works in all beauty.</p>
          <p> Medium layout is good for mixed content, such as: video, images, and etc. in one gallery. </p>
        </div>
      </div>
      <div class="box3">
        <h2>theme that really<br> meets your<br> requirements</h2>
        <div class="box">
          <p> Ambitious perfect for almost any kind of websites.</p>
          <p> Soft, clean, friendly design of this theme, won't leave your website visitors indifferent.</p>
          <p> This theme has no face, you can make it unrecognizable but still amazing, no one will blame you for template :P </p>
        </div>
      </div>
      <div class="box4">
        <h2>lovely<br> theme colors</h2>
        <div class="box">
          <p> This Theme comes with
            11 different color variations
            and will have more in our upcoming updates.</p>
          <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus condimentum, massa eu accumsan pellentesque, felis metus imperdiet est. </p>
        </div>
      </div>
    </div>
  </div>
  <div class="clear"></div>
  <footer>
  <p>© 2018 ambitious. All rights reserved.</p>
  </footer>
</div>
</body>
</html>
